import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Input, InputNumber, Form, Button, Radio } from 'antd'

class AddDepartmentForm extends Component {
  constructor (props) {
    super(props)
  }

  render () {
    const layout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 16 },
    }

    return (
      <div style={{ margin: 20 }}>
        <Form {...layout} layout="inline" name="nest-messages" onFinish={this.props.onFinish}>
          <Form.Item name="name" label="名称" rules={[{ type: 'string' }, { required: true }]}>
            <Input/>
          </Form.Item>
          <Form.Item name="place" label="地点" rules={[{ type: 'string' }, { required: true }]}>
            <Input/>
          </Form.Item>
          <Form.Item name="phone" label="电话" rules={[{ type: 'number' }, { required: true }]}>
            <InputNumber/>
          </Form.Item>
          <Form.Item name="option" label="操作类型" rules={[{ required: true }]}>
            <Radio.Group>
              <Radio value={0}>更新信息</Radio>
              <Radio value={1}>添加部门</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item wrapperCol={{ span: 16 }}>
            <Button type="primary" htmlType="submit">
              执行操作
            </Button>
          </Form.Item>
        </Form>
      </div>
    )
  }
}

AddDepartmentForm.propTypes = {
  onFinish: PropTypes.func.isRequired
}

export default AddDepartmentForm
